/**
 * Created by hdw on 2017/6/27.
 */
import React, {Component} from 'react'
import {Link} from 'react-router'
import '../sass/Ad'

import AdDefaultBg from '../../global/components/AdDefaultBg'
import LazyLoad from 'react-lazyload'
import {forceCheck} from 'react-lazyload'


export default class Ad extends Component {
  constructor() {
    super()
  }

    componentDidUpdate(){
        setTimeout(()=>{forceCheck()},500)
    }

  render() {
    const {item, jumpTo} = this.props
    let deviceWidth = `${(window.innerWidth - 30) * 0.4}px`

    if (item.length) {
      return (
          <div className="ad" style={item[0].seamlessStitching ? {margin: '0px 0.15rem'} : null}>
              <Link className="link" style={{display: 'block'}} onClick={item[0].link ? jumpTo.bind(this, item[0].link) : null}>
                  <LazyLoad placeholder={<AdDefaultBg/>}>
                      <img src={item[0].pictureUrl}/>
                  </LazyLoad>
              </Link>
          </div>
      )
    } else {
      return (
            <section></section>
      )
    }
  }
}
